<script setup lang="ts">
import myCareerImg from "@/views/qq/home/home-center/center-right/img/my-career.jpg";
import relaxImg from "@/views/qq/home/home-center/center-right/img/relax.jpg";
import tournamentImg from "@/views/qq/home/home-center/center-right/img/tournament.jpg";
import RotateButton from "@/views/qq/home/home-center/center-right/RotateButton.vue";

const arr = [
  {
    id: 1,
    src: myCareerImg,
    srcHeight: '3em',
    title: '对战房间',
    engTitle: 'BATTLE ROOM',
    backgroundColor: '#f6e73a',
    textColor: '#83532d',
    engTextColor: '#83532d'
  },
  {
    id: 2,
    src: tournamentImg,
    srcHeight: '2.2em',
    title: '赛事比赛',
    engTitle: 'TOURNAMENT',
    backgroundColor: '#43c0fd',
    textColor: 'white',
    engTextColor: 'white'
  },
  {
    id: 3,
    src: myCareerImg,
    srcHeight: '2em',
    title: '个人生涯',
    engTitle: 'MY CAREER',
    backgroundColor: 'rgba(0, 0, 255, 0.2)',
    textColor: 'white',
    engTextColor: '#2bbad8'
  },
  {
    id: 4,
    src: relaxImg,
    srcHeight: '2em',
    title: '休闲区',
    engTitle: 'RELAX',
    backgroundColor: 'rgba(0, 0, 255, 0.2)',
    textColor: 'white',
    engTextColor: '#2bbad8'
  }
]

</script>
<template>
  <RotateButton :arr="arr"/>
</template>
<style scoped lang="scss">
</style>